@import "../base/reset.less";
@import "../base/colors.less";
@import "../base/spacing.less";
@import "../base/typography.less";
@import "../utils/decorators.less";

* {
  box-sizing: border-box;
}

html,
body,
main {
  height: 100%;
}

body {
  &:extend(.system-font);
  font-size: 14px;
}

main {
  height: 100%;
  &:extend(.vertical-scroll);

  &.empty {
    font-size: 20rem;
    color: fadeout(@color-text--light, 80%);
    margin-top: 20vh;
    text-align: center;
    -webkit-text-stroke-width: 5px;
    -webkit-text-stroke-color: #fff;
  }

  img,
  video,
  audio {
    max-width: 100%;
  }

  textarea {
    &:extend(.code-font);
    width: 100vw;
    height: 100vh;
    resize: none;
    border: 0;
    outline: 0;
    font-size: 13px;
    padding: 10px;
  }
}